<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        html,
        body {
            height: 100%;
        }

        body {
            margin: 0;
            display: grid;
            grid-template: 70px 20px 1fr 20px / 200px 20px 1fr 20px;
            grid-template-areas: "h h h h" "a . . ." "a . m ." "a . . . ";

        }

        header {
            background-color: aquamarine;
            grid-area: h;
        }

        aside {
            background-color: burlywood;
            grid-area: a;
        }

        main {
            background-color: greenyellow;
            grid-area: m;
        }
    </style>
</head>

<body>
    <header>header</header>
    <aside>aside</aside>
    <main>main</main>
</body>

</html>